<template>
<van-dialog
    v-model="showDialog"
    closeOnClickOverlay
    :show-confirm-button="false"
>
  <van-field
      v-model="phone"
      label="手机号"
      placeholder="请输入手机号"
  />
  <van-field
      v-model="sms"
      label="短信验证码"
      placeholder="请输入短信验证码"
  >
    <template #button>
      <van-button size="small" type="primary">发送验证码</van-button>
    </template>
  </van-field>
  <template>
    <div class="register-btn">
      <van-button size="small" type="primary" @click="register">注册</van-button>
    </div>
  </template>
</van-dialog>
</template>

<script>
export default {
  name: "Register",
  data() {
    return {
      showDialog: false,
      phone: '',
      sms: ''
    }
  },
  methods: {
    show() {
      this.showDialog = true
    },
    register() {
      // 注册成功需通知父组件查询用户信息
    }
  }
}
</script>

<style lang="less" scoped>
.van-dialog{
  padding: 10px;
}
.van-cell{
  margin-top: 10px;
  height: 33px;
}
.register-btn{
  text-align: center;
  margin-top: 20px;
  .van-button{
    width: 150px;
  }
}
</style>